<template>
	<div class="companys">
    <el-row :gutter="20">
      <el-col :xs="12" :sm="12" :md="8" :lg="6" :xl="4" v-for="(item,index) in companyList" :key="index">
    <el-card class="box-card fl"  >
      <div :class="{'content':true,'blackAndwhite':item.isDispaly}">
        <div @click="toChildRouter(item.companyid)">
            <div class="tb_baba clear">
              <div class="wlws_logo fl" v-if="item.cpyLogo!==''">
      					<img width="52" height="52" style="border-radius:4px;" :src="imgServer+item.cpyLogo" alt="">
      				</div>
    				  <div v-else class="wlws_logo  iconfont icon-zhongtong fl"></div>
              <h2 class="ztwlw_ fl">{{item.companyname}}</h2>
            </div>
            <div class="gsxz_baba"><span class="bt_v2 iconfont icon-duobianxingkaobei"></span>成立时间：{{item.cpyDate|toTime}}</div>
           <div class="gsxz_baba"><span class="bt_v2 iconfont icon-duobianxingkaobei"></span>公司电话：{{item.cpyTel}}</div>
       </div>
    <div class="wlwgs_xian" >
        <el-switch class="fl" 
            :active-value="0"
            :inactive-value="1" 
            :width="35" 
            v-model="item.isDispaly" 
            active-text="启用" 
            inactive-text="禁用"
            @change="statu_click($event,item.companyid)">
          </el-switch>
        <span class="_banben1_tb6 iconfont icon-chakanxiangqing1" @click="toChildRouter(item.companyid)"></span>
        <span class="_banben1_tb6 iconfont icon-xiugai" @click="toChildRouter(item.companyid)"></span>
        <span class="_banben1_tb6 iconfont icon-shanchu" @click.stop="delClickHandler(item.companyid ,item.companyname)"  v-if="item.disenable == 0"></span>
    </div>

   <!--   <div :class="item.disenable == 1 ? 'able' : 'enable'">
          {{item.disenable == 1? '当前' : '未审核'}}
        </div> -->

        <!-- <p>公司简介：{{item.cpyRemark}}</p> -->
        <!-- <div class="cpyRemark">{{item.cpyRemark}}</div> -->
        
    <!--删除操作-->
        <!-- <el-button type="text" @click.stop="delClickHandler(item.companyid ,item.companyname)" :class="item.disenable == 1 ? '' : 'deleted'" v-if="item.disenable == 0"></el-button> -->
      </div>
    </el-card>
    </el-col>
    <el-col  :xs="12" :sm="12" :md="8" :lg="6" :xl="4" >
      <el-card class="box-card newAddCompany">
          <div class="content" @click="addInfoEvent">
            <img class="add-img" src="../../../common/images/add.png" alt="add">
            <p>新建子公司创建模板</p>
          </div>
    </el-card>
    </el-col>

  </el-row>
		<addCompany
		v-if="dialogFormVisible"
		:dialogFormVisible.sync="dialogFormVisible"
		:addCompanyForm="addCompanyForm"
		:addSubmit="addSubmit">
	  </addCompany>
  </div>
</template>

<script>
  import {getProvincial}   from '../../../common/js/provincial'
	import {IMGSERVER}   from '../../../common/js/constant'
  import imgUpload         from '../../../components/img-upload/imgUpload'
	import addCompany from "./components/add_company.vue"
  export default{
    name:'company',
    data(){
      return {
        compStatus:true,
        companyList:[],
        disenable: 0,
        dialogFormVisible: false,
        city:[],
				addCompanyForm:{},
        labelPosition:'rigth',
        CityInfo:getProvincial(),
        pickerOptions:{
          //設置選擇時間不可大於以後的時間
          disabledDate(time) {
            return time.getTime() > Date.now();
          }
        },
				imgServer:IMGSERVER
      }
    },
    methods:{
      statu_click(val,cid){
         this.$post('/company/deleteCompany',{companyid:cid,isDispaly:val},(data)=> {
             
          },(err)=>{
            this.$message.error(err);
          })
      },
      getCompany(){
        this.$post('/company/getCompanyList',{pageNum:0,pageSize:100},(data)=> {
           this.companyList = data.rows;
        },(err)=>{
          this.$message.error(err);
        })
      },
      addSubmit(val) {
        this.$post('/company/saveCompany',val,(data)=>{
            this.$message({
              type: 'success',
              message: '添加成功!',
              callback: this.getCompany()
            })
        },(err)=>{
           this.$message.error(err);
        })
      },
       openFullScreen(delcompanyId) {
        this.delCompany(delcompanyId);
        const loading = this.$loading({
          lock: true,
          text: 'Loading',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });
      },
      //删除公司
      delCompany(delcompanyId){
        this.$post('/company/deleteCompany',{companyid: delcompanyId},(data)=>{
          this.$loading().close();   //关闭弹窗
          this.$message({
            type: 'success',
            message: '删除成功!'
          })
          this.getCompany();
        },(err)=>{
            alert("出错啦~"+err)
        })
      },
      //删除事件
      delClickHandler(delcompanyId,companyName){
        this.$confirm('此操作将永久删除《'+ companyName +'》公司记录, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
          this.openFullScreen(delcompanyId);
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      //表单提交
      submitForm(formName) {
        this.addcompanyForm.provincename =this.city[0];
        this.addcompanyForm.cityname     =this.city[1];
        this.addcompanyForm.countiesname =this.city[2];

        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.addSubmit();
          } else {
            this.$message({
              type: 'info',
              message: '提交失败'
            })
            //清空表单信息
            this.$refs.formName.resetFields();
            return false;
          }
        })
        this.dialogFormVisible = false;
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
        this.dialogFormVisible = false
      },
      toChildRouter(id){
        this.$router.push('/set/companys/' + id)
      },
      addInfoEvent(){
				// this.addCompanyForm = {};
        this.dialogFormVisible = true;
      }
    },
    computed:{
    },
    components:{
      imgUpload,
			addCompany
    },
    created(){
      this.getCompany();
    },
    mounted(){
    },
    filters:{
      toTime:function (value){
        let val = value.split(" ");
        return val[0];
        // var dateObj = new Date(value);
        // var year   = dateObj.getFullYear()+'年';
        // var month  = dateObj.getMonth()+1+'月';
        // var date   = dateObj.getDate()+'日';
        // return [year,month,date].join('');
      }
    }
  }
</script>

<style lang="scss">
.fl{
  float: left;
}
.fr{
  float: right;
}

.wlws_logo {
  text-align:center;
	width: 50px;
	height: 50px;
	 border-radius: 10px;
  background-color: #b5b5b5;
  border: solid 1px #e4edf0;
}
.tb_baba>.wlws_logo{
	font-size: 35px;
	color: #ffffff;
	line-height: 50px;
}
.content>.tb_baba>.ztwlw_{
	width: 70%;
	font-size: 16px;
	color: #333333;
	margin-left: 10px;
  margin-top: 19px;

}
.tb_baba{
  margin-bottom: 25px;
}
.ztwlw_{

}
.clsj_baba>.bt_v{
 width: 7px;height: 8px;
 font-size: 8px;
 margin-top: 18px;
 color: #e4edf0;
}
.content>.clsj_baba>.wlwgs_data{
  width: 90%;
	color: #666666;
	margin-top: 15px;
	margin-left: 3%;
	font-size: 14px;
}
.bt_v2{
 font-size: 8px;
 color: #e4edf0;
 margin-right:5px;
}
.gsxz_baba{
  color:#666;
  font-size:14px;
  height:30px;
  line-height:30px;
  overflow:hidden;
}
.content .gsxz_baba .wlwgs_xz{
  display:inline-block;
	color: #666666;
	font-size: 14px;
}
.clear{
  clear: both;
}
.wlwgs_shenhe{
	width: 51px;
  height: 17px;
 color: #72d18b;
  font-size: 16px;
  margin-left: 20px;
  margin-top: 4%;
}
.wlwgs_xian{
    margin-top: 20px;
    border-top: 1px solid #efefef;
    text-align:right;
    padding-top:10px;
}
.tb6_father {
    width: 20px;
    height: 20px;
    margin-top: 10px;
}
.tb7_father {
    margin:10px 0 0 13px;
}
._banben1_tb6 {
  color: #787878;
    font-size: 18px;
    margin-right: 7px;
}

.kaiguang_{
  margin-top: 7px;
}
  @import "company";
</style>
